<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="recv"></div>
<input id="msg" type="text"><button onclick="send()">发送</button>

<script>
    var webSocket = null;
    if ('WebSocket' in window){
        webSocket = new WebSocket("ws://localhost:8080/ws/test");
    }else{
        alert("当前浏览器不支持websocket");
    }
    webSocket.onclose = function(session){
        console.log("关闭连接");
    }
    webSocket.onmessage =  function(event){
        console.log(event);
        console.log("授受的数据是："+event.data);
        var content = document.getElementById("recv");
        content.innerHTML = content.innerHTML+"<p>"+event.data+"</p>";
    }
    function send(){
        var msgInput = document.getElementById("msg");
        var msg = msgInput.value;
        console.log(msg);
        webSocket.send(msg);//发送数据
        msgInput.value = "";
    }

</script>
</body>
</html>